<div class="panel panel-default userinfo">
  <div class="panel-body">
    <div id="cal-heatmap" class="user-activity-graph"></div>
    <%
      start_date = 12.months.ago.beginning_of_month
    %>
    <script type="text/javascript">
      var cal = new CalHeatMap();
      cal.init({
        itemSelector: "#cal-heatmap",
        animationDuration: 200,
        domain: "month",
        subDomain: 'day',
        rowLimit: 7,
        domainGutter: 0,
        data: '<%= calendar_user_path(@user, format: 'json') %>',
        start: new Date(<%= start_date.year %>, <%= start_date.month %>, <%= start_date.day %>),
        legendHorizontalPosition: 'right',
        legendColors: ["#E2FBAE", "#01840E"],
        // subDomainTextFormat: "%d",
        domainLabelFormat: "%b",
        legend: [5, 10, 15, 20, 25, 30],
        itemName: ['event', 'events'],
        highlight: 'now',
        label: {
          position: 'top'
        },
        displayLegend: true
      });
    </script>
  </div>
</div>


<% cache([@user, "user-skill"]) do %>
    <% if !@user.skills.blank? %>

        <div class="panel panel-default user-skills">
          <div class="panel-heading">个人技能</div>
          <div class="panel-body">
            <ul class="nav nav-pills" role="tablist">
              <% @user.skills.each do |skill, count| %>
                  <li><span class="label label-info label-skill"><%= skill %></span></li>
              <% end %>
            </ul>
          </div>
        </div>
    <% end %>
<% end %>

<% cache([@user, "bio-markdown"]) do %>
    <% if !@user.bio.blank? %>
        <div class="panel panel-default bio">
          <div class="panel-heading">个人介绍</div>
          <div class="panel-body markdown">
            <%= markdown(@user.bio) %>
          </div>
        </div>
    <% end %>
<% end %>